import { ref, computed } from 'vue'
import { getAllProduct, getAdProduct, getProductByCategory } from '../api/home.js'

const categories = ['服装', '数码', '家电', '食品', '书籍']
const selectedCategory = ref('服装')
const items = ref([])

const fetchItems = async () => {
    try {
        // const response = await fetch('/images.json')
        // const data = await response.json()
        // items.value = data.products || []
        const response = await getAllProduct()
        console.log('response',response)
        items.value = response.data.data || []
        console.log('hhh',response.data.data)
        console.log('items',items.value)
    } catch (error) {
        console.error('Error loading items:', error)
    }
}

// watch(selectedCategory, async (newCategory) => {
//     try {
//         const response = await getProductByCategory(newCategory)
//         items.value = response.data.data || []
//     } catch (error) {
//         console.error('Error loading items by category:', error)
//     }
// })

const filteredItems = computed(() => {
    const filtered = items.value.filter(item => item.categoryname === selectedCategory.value)
    //console.log('Filtered items:', filtered) // 添加调试信息
    //filtered=await getProductByCategory(selectedCategory.value);
    return filtered
})

const selectCategory = (category) => {
    selectedCategory.value = category
}

export { categories, selectedCategory, items, fetchItems, filteredItems, selectCategory }